<template>
    <div class="home-container">
        <div>
            <scroll-swiper class="g-flex-box kaijiang-warp" v-model="currentIndex" :navs="tabs">
                <components
                    v-for="(item, index) in tabs"
                    :key="index"
                    :slot="index"
                    :is="item.is"
                    :actived="currentIndex === index"
                    :type="item.type"
                />
            </scroll-swiper>
        </div>

        <bottom-menu></bottom-menu>
    </div>
</template>

<script>
import BottomMenu from 'components/bottom-menu/bottom-menu';
import ScrollSwiper from 'components/scroll-swiper/scroll-swiper';
import National from './components/national/national.vue';
import Place from './components/place/place.vue';
export default {
    name: 'DuoduocaiH5Kaijiang',
    components: { BottomMenu, ScrollSwiper, National, Place },
    data() {
        return {
            currentIndex: 0,
            tabs: [
                {
                    title: '全国彩',
                    is: National,
                    type: 0,
                },
                {
                    title: '地方彩',
                    is: Place,
                    type: 1,
                },
            ],
        };
    },

    mounted() {},

    methods: {},
};
</script>

<style lang="scss" scoped>
.home-container {
    height: 100%;
    width: 100%;
    padding-bottom: 50px;
    font-size: 13px;
}
</style>
